﻿@{
    ViewData["Title"] = "编辑用户";
    Layout = "~/Views/Shared/_LayoutNone.cshtml";
}
<div class="layui-form" lay-filter="layuiadmin-app-form-list" id="layuiadmin-app-form-list" style="padding: 20px 30px 0 0;">
    <div class="layui-form-item">
        <label class="layui-form-label">用户名</label>
        <div class="layui-input-block">
            <input type="text" disabled="disabled" id="user_name" name="user_name" maxlength="50" lay-verify="required|username" placeholder="请输入用户名" autocomplete="off" class="layui-input">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">角色</label>
        <div class="layui-input-block">
            <select id="role_id" name="role_id" lay-verify="required">
                <option value="">选择角色</option>
            </select>
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">昵称</label>
        <div class="layui-input-block">
            <input type="text" id="nick_name" name="nick_name" maxlength="50" lay-verify="required" placeholder="请输入昵称" autocomplete="off" class="layui-input">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">手机号</label>
        <div class="layui-input-block">
            <input type="tel" id="mobile_phone" name="mobile_phone" maxlength="11" placeholder="请输入手机号" autocomplete="off" class="layui-input">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">职位</label>
        <div class="layui-input-block">
            <input type="text" id="user_job" name="user_job" maxlength="50" placeholder="请输入职位" autocomplete="off" class="layui-input">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">Email</label>
        <div class="layui-input-block">
            <input type="email" id="user_email" name="user_email" maxlength="50" placeholder="请输入Email" autocomplete="off" class="layui-input">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">限制IP</label>
        <div class="layui-input-block">
            <input type="text" id="limit_ip" name="limit_ip" maxlength="50" placeholder="请输入限制IP段登录" autocomplete="off" class="layui-input">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">状态</label>
        <div class="layui-input-block">
            <input type="checkbox" lay-verify="required" lay-filter="switch_user_status" id="switch_user_status" name="switch_user_status" lay-skin="switch" lay-text="启用|禁用">
        </div>
    </div>

    <div class="layui-form-item layui-hide">
        <input type="hidden" id="user_id" name="user_id" value="@ViewContext.HttpContext.Request.Query["id"]" />
        <input type="hidden" id="country_code" name="country_code" value="+86" />
        <input type="hidden" id="user_avatar" name="user_avatar" value="" />
        <input type="hidden" id="user_status" name="user_status" value="true" />
        <input type="hidden" id="gender_id" name="gender_id" value="0" />
        <input type="button" lay-submit lay-filter="layuiadmin-app-form-submit" id="layuiadmin-app-form-submit" value="确认添加">
        <input type="button" lay-submit lay-filter="layuiadmin-app-form-edit" id="layuiadmin-app-form-edit" value="确认编辑">
    </div>

</div>

<script src="~/layuiadmin/layui/layui.js"></script>
<script>
    layui.config({
        base: '/layuiadmin/'
    }).extend({
        index: '/lib/index'
    }).use(['index', 'laydate', 'form'], function () {
        var $ = layui.$
            , form = layui.form
            , admin = layui.admin
            , laydate = layui.laydate;

        // 监听指定开关
        form.on('switch(switch_user_status)', function (data) {
            if (this.checked) {
                $("#user_status").val(true);
            } else {
                $("#user_status").val(false);
            }
        });

        // 默认加载
        $(function () {
            var user_id = $("#user_id").val();
            loading = layer.load(2, {
                shade: [0.2, '#000']
            });

            admin.req({
                url: '/users/details'
                , data: { id: user_id }
                , done: function (res) {
                    // console.log(`res=${JSON.stringify(res)}`);
                    layer.close(loading);
                    $("#open_id").val(res.data.open_id);
                    $("#country_code").val(res.data.country_code);
                    $("#user_name").val(res.data.user_name);
                    $("#user_avatar").val(res.data.user_avatar);
                    $("#nick_name").val(res.data.nick_name);
                    $("#user_gender").val(res.data.user_gender);
                    $("#role_id").val(res.data.role_id);
                    $("#user_slogan").val(res.data.user_slogan);
                    $("#user_from").val(res.data.user_from);
                    $("#user_intro").val(res.data.user_intro);
                    $("#user_job").val(res.data.user_job);
                    $("#company_name").val(res.data.company_name);
                    $("#user_email").val(res.data.user_email);
                    $("#user_qq").val(res.data.user_qq);
                    $("#mobile_phone").val(res.data.mobile_phone);
                    $("#user_address").val(res.data.user_address);
                    $("#limit_ip").val(res.data.limit_ip);

                    $("#switch_user_status").prop("checked", res.data.user_status);

                    // 角色
                    admin.req({
                        url: '/userroles/select'
                        , done: function (res_roleid) {
                            // console.log(`res={res_roleid.data}`);
                            $.each(res_roleid.data, function (i, item) {
                                if (res_roleid.data[i].role_id == res.data.role_id) {
                                    $("#role_id").append("<option value=\"" + item.role_id + "\" selected>" + item.role_name + "</option>");
                                }
                                else {
                                    $("#role_id").append("<option value=\"" + item.role_id + "\">" + item.role_name + "</option>");
                                }
                            });
                            layui.form.render('select');
                        }
                    });

                    form.render();
                }
            });
        });

        // 监听提交
        form.on('submit(layuiadmin-app-form-edit)', function (data) {
            var field = data.field;
            var index = parent.layer.getFrameIndex(window.name);
            loading = layer.load(2, {
                shade: [0.2, '#000']
            });

            // 提交数据
            admin.req({
                headers: {
                    'RequestVerificationToken': csrfToken
                },
                method: 'POST',
                url: '/users/edit?id=' + data.field.user_id
                , data: data.field
                , done: function (res) {
                    // console.log(`res=${JSON.stringify(res)}`);
                    layer.close(loading);
                    parent.layui.table.reload('LAY-app-content-list');
                    layer.msg(res.msg, {
                        offset: '15px'
                        , icon: 1
                        , time: 2000
                    }, function () {
                        parent.layer.close(index);
                    });
                }
            });
        });
    })
</script>
